<%@ page language="java" errorPage="/error.jsp" pageEncoding="UTF-8" contentType="text/html;charset=UTF-8" %>
<%@ include file="/common/taglibs.jsp"%>
<link rel="stylesheet" href="common/css/panel.css" type="text/css">

<script type="text/javascript">

// ** validate signup form on keyup and submit
jQuery(function($) {
	$("#orderSubmit").click(function() {
		if($("#orderBox").find("tr").length <= 1) {
			alert("请先点餐");
			return ;
		}
		
		$("#orderForm").submit();
	});
	
	var validator = $("#orderForm").validate({
		rules : {
			contactMan : "required",
			telephone : {
				required : true,
				minlength : 11
			},
			contactAddress : {
				required : true,
				minlength : 5
			}
		},
		messages : {
			contactMan : " ",
			telephone : " ",
			contactAddress : " "
		},
		// the errorPlacement has to take the table layout into account
		errorPlacement : function(error, element) {
			if (element.is(":radio"))
				error.appendTo(element.parent().next().next());
			else if (element.is(":checkbox"))
				error.appendTo(element.next());
			else
				error.appendTo(element.parent().next());
		},
		// set this class to error-labels to indicate valid fields
		success : function(label) {
			// set &nbsp; as text for IE
			label.html("&nbsp;").addClass("checked");
		}
	});
});

// ** recalculate the shopping cart amount
function recalcAmount(amount, num) {
	var $allAmounts = $("#allAmounts");
	var $allNums = $("#allNums");
	var price = parseInt($allAmounts.text()) + parseInt(amount)*parseInt(num);
	
	$allAmounts.text(price);
	$allAmounts.prev().val(price);
	$allNums.text(parseInt($allNums.text()) + parseInt(num));
}

jQuery(function($) {

	bindOrderBoxBtnEvent($("#orderBox"));
	
	// ** bind order icon click event
	function bindOrderBoxBtnEvent($orderBox) {
		//** add one more dish
		$orderBox.find("tr:first .btn_add").parent().click(function() {
			var $quantity = $(this).prev();
			$quantity.val(parseInt($quantity.val()) + 1);

			var price = $(this).parent().prev().find("span.orderBox_no_2").text();
			recalcAmount(price, 1);
			
			return false;
		});
		//** delete a dish
		$orderBox.find("tr:first .btn_minus").parent().click(function() {
			var $quantity = $(this).next();
			var quantity = parseInt($quantity.val());
			if(quantity > 1) {
				$quantity.val(quantity - 1);

				var price = $(this).parent().prev().find("span.orderBox_no_2").text();
				recalcAmount(price, -1);
			}
			
			return false;
		});
		// ** cancel the dish
		$orderBox.find("tr:first .btn_cancel").parent().click(function() {
			// recalc the amount
			var price = $(this).parent().prev().prev().find("span.orderBox_no_2").text();
			var quantity = $(this).parent().prev().find("input[name$='count']").val();
			recalcAmount(price, -parseInt(quantity));
			
			$(this).parents("tr").remove();
			
			return false;
		});
	}

});

</script>

<div class="span-7">

	<!-- 网站公告 -->
	<div class="panel_leftline">
		<div class="panel_rightline">
			<div id="notice_panel">
				<div class="panel_title">
					网站公告
				</div>
				<div class="panel_title_more">
					<a href="#">更多&gt;&gt;</a>
				</div>
			</div>
			<div class="panel_content">
				<ul class="listItems">
					<li class="listItem"><div class="time">07/22</div><a style="color:red;font-weight:bold" class="listItem" target="_self" href="links/notice.jsp">百事可乐免费赠</a></li>
					<li class="listItem"><div class="time">07/22</div><a style="color:#00A005;font-weight:bold" class="listItem" target="_self" href="links/fruits.jsp">明日水果预告</a></li>
					<li class="listItem"><div class="time">07/15</div><a class="listItem" target="_self" href="#">目前只限黄浦区域</a></li>
					<li class="listItem"><div class="time">07/15</div><a class="listItem" target="_self" href="#">积分换小礼品</a></li>
					<li class="listItem"><div class="time">07/15</div><a class="listItem" target="_self" href="#">节假日放假通知</a></li>
				</ul>
			</div>
		</div>
	</div>
	<div class="panel_bottom panel_bottom_color"></div>
	


	<!-- 订餐时间 -->
	<!-- 
	<div class="panel_leftline" style="margin-top: -3px;">
		<div class="panel_rightline">
		<div id="orderTime_panel">
			<div class="panel_title">订餐时间</div>
		</div>
	
		<div>
			<div class="orderTimeinfo">
			
				<div>
					<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"
					WIDTH="260" HEIGHT="60" >
						<PARAM VALUE="common/images/resource/flashtime.swf">
						<PARAM VALUE=high>
						<PARAM VALUE=#FFFFFF>
						<EMBED src="common/images/resource/flashtime.swf" quality=high bgcolor=#FFFFFF WIDTH="260" HEIGHT="60"
						NAME="myMovieName" ALIGN="center" TYPE="application/x-shockwave-flash"
						PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
						</EMBED>
					</OBJECT>
				
				</div>
			
				<div class="boldfont">午餐：<font style="color:#404040;">9:00&nbsp;-&nbsp;13:00</font></div>
				<div class="boldfont">晚餐：<font style="color:#404040;">16:00&nbsp;-&nbsp;19:00</font></div>
				<div class="boldfont">注：周六日或其他时间用餐，请提前来电</div>		
				<div style="text-align:center;">
					
					<a target="_blank" href="tencent://message/?uin=250529708&Site=www.nxnkc.com&Menu=yes" style="margin-right: 20px;">
						<img border="0" src=http://wpa.qq.com/pa?p=1:250529708:11 alt="点击这里给我发消息">
					</a> 
					<a target="_blank" href="tencent://message/?uin=495814131&Site=www.nxnkc.com&Menu=yes">
						<img border="0" src="http://wpa.qq.com/pa?p=1:495814131:11" alt="点击这里给我发消息">
					</a>
					<br />
					<a target="_blank" href="http://settings.messenger.live.com/Conversation/IMMe.aspx?invitee=bd8d8a78ea31f9ef@apps.messenger.live.com&mkt=en-US">
						<span>MSN:订餐</span><img style="border-style: none;" src="http://messenger.services.live.com/users/bd8d8a78ea31f9ef@apps.messenger.live.com/presenceimage?mkt=en-US" width="16" height="16" />
					</a>
				</div>
			</div>
		</div>
	</div>
	</div>
	<div class="panel_bottom"></div>
	 -->
	 
	 
	<!-- 购物车 -->
	<div class="panel_leftline">
	  <div class="panel_rightline">
		<form id="orderForm" action="order/delivery-order!save.action" method="post" autocomplete="off">
			<div id="cart_panel">
				<div class="panel_title">我的餐车</div>
			</div>
			
			<div style="padding:px;margin-bottom:10px;">
				<div style="height:18px; background:#f6f6f6;margin:0px 3px;">
					<span style="padding-left: 20px;">名称</span>
					<span style="padding-left: 80px;">份数</span>
					<span style="padding-left: 25px;">单价</span>
					<span style="padding-left: 25px;">取消</span>
				</div>
				
				<div id="orderBox" style="margin:0px 3px 1px 3px;" >
					<table width="100%" cellspacing="0" cellpadding="0" border="0">
	                          <!-- 如果菜单为半价产品，不允许增减数量 -->
	                      	<tr style="display: none">
	                      		<input type="hidden" name="orderList[0].dishId" disabled="disabled" />
	<!--                        		<input type="hidden" name="orderList[0].type" disabled="disabled"/>-->
	                              <td width="125" class="orderBox_td_line">
	                              	<span></span>
	                              </td>
	                              <td width="45" class="orderBox_td_line">
	                              	<span class="orderBox_no_2"></span>
	                              </td>
	                              <td width="50" class="orderBox_td_line">
			                    <a href="#">
				                  <img class="btn_minus" src="common/images/btn/btn_minus.gif">
					            </a>
					            <input type="text" name="orderList[0].count" readonly="readonly" style="width:19px;" disabled="disabled">
					            <a href="#">
					            	<img class="btn_add" src="common/images/btn/btn_add.gif">
					            </a>
	                        </td>
	                              <td class="orderBox_td_line">
	                              	<a href="#" style="padding-left: 15px;">
	                              		<img class="btn_cancel" src="common/images/btn/btn_cancel.gif">
	                              	</a>
	                              </td>
	                      	</tr>
	                  	</table>
				</div>
				
				<div id="orderSubtotal" style="height:24px;margin:5px 3px 1px 3px;">
					<div style="float:left;line-height:24px;padding-left:25px;">小&nbsp;&nbsp;计：</div>
					<div style="float:right;line-height:24px;padding-right:15px;"><font id="allNums" style="color:#ff0000;">0</font>份</div>
					<div style="float:right;line-height:24px;padding-right:30px;">
						<input type="hidden" name="price" />
						<font id="allAmounts" style="color:#ff0000;">0</font>元
					</div>
				</div>
			</div>
			
			<hr style="height:1px; color:#999999;">
			<div id="ordering">
				<table width="100%" height="150px">
					<tbody>
					<tr>
						<td class="label"><label for="contactName">联 系 人：</label></td>
						<td class="field">
							<input type="text" name="contactName" class="valid" maxlength="20" value="">
						</td>
						<td class="status"></td>
					</tr>
					<tr>
						<td class="label"><label for="telephone">联系电话：</label></td>
						<td class="field">
							<input type="text" name="telephone" class="valid" maxlength="20" value="">
						</td>
						<td class="status"></td>
					 </tr>
					<tr>
						<td class="label"><label for="contactAddress">送餐地址：</label></td>
						<td class="field">
							<input type="text" name="contactAddress" class="valid" maxlength="20" value="">
						</td>
						<td class="status"></td>
					 </tr>
					<tr>
						<td class="label"><label for="remarks">其它备注：</label></td>
						<td class="field">
							<textarea name="remarks" style="width: 140px; height: 70px;" class="valid" title="请输入您的要求"></textarea>
						</td>
						<td class="status"></td>
					 </tr>
					 <tr>
					   <td class="label">送到时间：</td>
					   <td>
							<select name="deliveryTime">
								<option value="11:00:00">11:00</option>
								<option value="11:15:00">11:15</option>
								<option value="11:30:00">11:30</option>
								<option value="11:45:00">11:45</option>
								<option value="12:00:00" selected="selected">12:00</option>
								<option value="12:15:00">12:15</option>
							</select>
							<span>&nbsp;</span>
							<select name="payMode">
								<option selected="selected" value="1">上门收费</option>
							</select>
						</td>
						<td>
						</td>
					 </tr>
				   </tbody>
				</table>
				<div>
					<div id="orderSubmit" class="order_submit" style="cursor: pointer;">确认购物</div> 
				</div>
			</div>
		</form>
			
	  </div>	
	</div>
	<div class="panel_bottom"></div>
	      
	<!-- 订餐指南 -->
	<div class="panel_leftline">
		<div class="panel_rightline">
			<div id="guide_panel">
				<div class="panel_title">
					订餐指南
				</div>
			</div>
			<div class="panel_content">
				<ul class="listItems">
					<li class="listItem"><div class="time">07/15</div><a class="listItem" target="_self" href="#">订餐流程</a></li>
					<li class="listItem"><div class="time">07/15</div><a class="listItem" target="_self" href="#">每周菜品</a></li>
					<li class="listItem"><div class="time">07/15</div><a class="listItem" target="_self" href="#">订餐区域</a></li>
				</ul>
			</div>
		</div>
	</div>
	<div class="panel_bottom panel_bottom_color"></div>
	
	
	
	<!-- 亲情支持公司 -->
	<div class="panel_leftline">
		<div class="panel_rightline">
			<div id="lovely_panel">
				<div class="panel_title">
					亲情给力支持
				</div>
			</div>
			<div class="panel_content">
				<ul class="listItems">
					<li class="listItem">伦杰信息技术(上海)有限公司</li>
					<li class="listItem">臣信房屋</li>
					<li class="listItem">汉宇地产</li>
					<li class="listItem">上海旅行社</li>
					<li class="listItem">春申旅行社</li>
					<li class="listItem">春秋旅行社</li>
					<li class="listItem">韦博英语培训</li>
					<li class="listItem">华尔街英语培训</li>
				</ul>
			</div>
		</div>
	</div>
	<div class="panel_bottom panel_bottom_color"></div>
	
	<!-- 友情链接 -->
	<div class="panel_leftline">
		<div class="panel_rightline">
			<div id="friends_panel">
				<div class="panel_title">
					友情链接
				</div>
			</div>
			<div style="height: 380px;">
				<ul class="friendsList">
				  <li class="friendsItem"><a href="http://www.kfc.com.cn/kfccda/index.aspx" target="_blank" title="肯德基">
					  	<img src="common/images/panel/friendslink/kfc.jpg"/></a></li>
				  <li class="friendsItem"><a href="http://www.mcdonalds.com.cn/" target="_blank" title="McDonald">
				  		<img src="common/images/panel/friendslink/McDonald.jpg"/></a></li>
				  	
				  <li class="friendsItem"><a href="http://www.4008123123.com/phhsios/index.htm" target="_blank" title="必胜客">
					  	<img src="common/images/panel/friendslink/pizza.jpg"/></a></li>
				  <li class="friendsItem"><a href="http://www.yongho.cn/" target="_blank" title="永和大王">
				  		<img src="common/images/panel/friendslink/yhdw.jpg"/></a></li>
				  	
				  <li class="friendsItem"><a href="http://www.4006009900.com/" target="_blank" title="真功夫">
					  	<img src="common/images/panel/friendslink/realGongfu.jpg"/></a></li>
				  <li class="friendsItem"><a href="http://www.yoshinoyashanghai.com/" target="_blank" title="吉野家">
				  		<img src="common/images/panel/friendslink/jyj.jpg"/></a></li>
				  	
				  <li class="friendsItem"><a href="http://www.chamate.cn/" target="_blank" title="一茶一坐">
					  	<img src="common/images/panel/friendslink/ycyz.jpg"/></a></li>
				  <li class="friendsItem"><a href="http://www.dfjb.com.cn/" target="_blank" title="东方既白">
				  		<img src="common/images/panel/friendslink/dfjb.jpg"/></a></li>
				</ul>
			</div>
		</div>
	</div>
	<div class="panel_bottom panel_bottom"></div>
	
	
	<!-- 会员中心 -->
	<div class="panel_leftline" style="display: none">
		<div class="panel_rightline">
			<div id="member_panel">
				<div class="panel_title">
					会员中心
				</div>
			</div>
			<div class="panel_content">
				<ul class="listItems">
					<li class="listItem"><a class="listItem" target="_self" href="#">订餐查询</a></li>
					<li class="listItem"><a class="listItem" target="_self" href="#">消费记录</a></li>
					<li class="listItem"><a class="listItem" target="_self" href="#">登录帐号</a></li>
					<li class="listItem"><a class="listItem" target="_self" href="#">联系信息</a></li>
					<li class="listItem"><a class="listItem" target="_self" href="#">我的积分</a></li>
					<li class="listItem"><a class="listItem" target="_self" href="#">我的点评</a></li>
					<li class="listItem"><a class="listItem" target="_self" href="#">个人资料修改</a></li>
					<li class="listItem"><a class="listItem" target="_self" href="#">退出登录</a></li>
				</ul>
			</div>
		</div>
	</div>
	<div class="panel_bottom panel_bottom_color"></div>
</div>